<template>
  <view class="apply_mention">
  	<view class="applymention-card" @click="viewApplyDetail(JSON.parse(detail.content).apply_id)">
  		<view class="applymention-Title">
  			审批
  		</view>
  		<view class="applymentiontitle"> {{ JSON.parse(detail.content).title }} </view>
  
  	 <view class="applymention-header">
  			<view class="applymention-title">{{ JSON.parse(detail.content).content }}</view>
  		</view>
  	</view>
  </view>
</template>

<script>
import { chatApi } from '@/apis/cloud/chat'

export default {
  name: 'ApplyMention',
  props: {
		detail: {
			type: Object,
			required: true
		},
  },
  data() {
		return {

		}
	},
	methods: {
		truncateValue(text, maxLines = 4) {
		  const lineCharCount = 19;
		  const maxLength = lineCharCount * maxLines;
		  if (text === null || text === undefined) return '';
		  const str = String(text);
		  if (str.length <= maxLength) return str;
		  return str.slice(0, maxLength) + '...';
		},
		viewApplyDetail(id) {
			uni.navigateTo({
				url: `/pages/apply/oaList/applyOrderDetail?id=${id}`
			})
		},
  }
};
</script>

<style lang="scss" scoped>
	@import "../../config/global.scss";
.apply_mention .applymention-card{
	background-color: #ffffff;
	border: 1px solid #e0e0e0;
	width: 450rpx;
	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.applymention-Title{
	font-weight: 600;
	background-color: #fff2e0;
	margin-bottom: 1px;
	padding: 8px;
	border-radius: 10px 10px 0px 0px;
	color: #fd9100;
}

.applymention-card{
	background-color: #ffffff;
	padding: 2px;
	border-radius: 10px;
}

.applymentiontitle{
	font-weight: 600;
	padding: 4px;
}

.applymention-header{
	border-radius: 5px;
	padding:0 5px;
	display: flex;
	padding-top: 3px;
	padding-bottom: 3px;
}

.applymention-title{
	padding-top: 8rpx;
}

</style>
